<template>
  <p>{{ mainStore.arr }}</p>
  <p>{{ mainStore.constAdd }}</p>
  {{ mainStore.count }}-----{{ mainStore.foo }}
  <hr />
  {{ count }}storeToRefs-----{{ foo }}
  <button @click="handleChage">修改</button>
</template>
<script lang="ts" setup>
import { storeToRefs } from "pinia";
import { useMainStore } from "../store/index";
const mainStore = useMainStore();
const { count, foo } = storeToRefs(mainStore);
const handleChage = () => {
  //1、修改单个
  //mainStore.count++
  //2、修改多个
  /* mainStore.$patch({
    count:mainStore.count+1,
    foo:'hello',
    arr:[...mainStore.arr,5]
  }) */

  //3、$patch一个函数吗，批量更新
  /* mainStore.$patch((state) => {
    state.count++, (state.foo = "hello"), state.arr.push(66);
  }); */
  mainStore.chageState(5)
};
</script>
